<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    // 全局变量
    // 1. 在函数外通过关键词 var let const 声明
    // 2. 不通过关键词var let const  直接声明

    // 全局作用域  => 自当前script标签开始的任何位置

    // 局部变量
    // 1. 在函数内通过关键词 var let const 声明
    // 2. 形参也是局部变量

    // 局部作用域/函数作用域 => 只在函数中有效 不会影响函数外


    // 函数内 局部变量和全局变量 混用 => 先看自己有没有? 自己有就找自己的 ,自己没有就向外跳一层 找父作用域

    

    // 1.  
    // var a = 10;   // 10   100
    // function fn() {
    //     a = 100;  // 全局 
    //     console.log("函数内的a:", a);  // 100
    // }
    // console.log("函数外的a:", a); // 10
    // fn();
    // console.log("函数外的a:", a); // 100
    

    // 2.
    // var a = 10;   //全局  10 
    // function fn() {
    //     var a = 100; // 局部  100
    //     console.log(a); // 100
    // }
    // fn();
    // console.log(a);  // 10

    // 2.1  !!!!!!!!!!!!!!!
    var a = 10;  //全局  10  
    function fn() {   // js预编译
        // var a;

        a = 100;   // 局部 
        console.log(a);  // 100

        var a = 1332; 
    }
    fn();
    console.log(a);  // 10


    // 3. 
    // var a = 10;  // 全局 10
    // function fn(a) { //形参 => 局部
    //     a = 100;
    //     console.log(a);  // 100
    // }
    // fn(10); // 
    // console.log(a); // 10


    // 3.1
    // console.log(a);
    // a = 100;
    // console.log(a);

    // function fn() {
    //     a = 200;
    //     console.log("我是函数里的a:", a);
    // }

    // fn();
    // console.log("我是函数外的a:", a);


    // 4. 
    // var a = b = 10;  // 全局  a = 10 ;  b = 10  20
    /* 
        b = 10;
        var a = b;
    
    */

    //  function fn() {
    //     var a = b = 20; 
    //      /* 
    //         b = 20;     全局b  20
    //         var a = b;  局部a  20
        
    //     */

    //     console.log("函数内：", a, b);  // 20 20
    // }

    // fn();
    // console.log("函数外", a, b); // 10  20

    // 5. 函数在执行时 ,变量只跟自身,和父作用域有关 ,跟你在哪里调用无关
    /* var a = 10;  // 全局
    function fn() {
        var a = 100;   //局部
        console.log("函数内a：", a);  // 100

        c();

        // function b() {
        //     var a = 1000;
        //     c();
        // }
        // b();
    }

    function c() {
        // var a = 1000;
        console.log("c里面的a", a); // 10   先看自己有没有? 自己有就找自己的 ,自己没有就向外跳一层 找父作用域
    }

    fn(); */

    //5.1
    var a = 10;   //全局
    function fn() {
        var a = 100;  //局部  100
        console.log("函数fn内：", a);  // 100

        
        function c() {
            console.log("c里面的a", a); // 100
        }
        c();
    }

    fn();
    console.log("函数外：", a);  // 10










</script>
</html>